<style>
    .table-bordered { border-top: 2px solid #ddd;}
    .table-bordered > thead > tr > th, .table-bordered > thead > tr > td { border-bottom-width: 3px;}
    .table-striped > tbody > tr:nth-of-type(odd) { background-color: #fff;}
</style>
<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="coll/collection/cancelbill?ids={$ids}">
    <div class="content">
        <div class="panel panel-default panel-intro">

            <div class="panel-body">
                <div id="myTabContent" class="tab-content">
                    <div class="tab-pane fade active in" id="one">
                        <div class="widget-body no-padding">

                            <div class="bootstrap-table">
                                <div class="commonsearch-table ">
                                    <fieldset>
                                        <div class="row">
                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                                                <label class="control-label col-xs-4">单据类型:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <select name="pay_type" id="pay_type" class="form-control "disabled >
                                                        <option value="1" {if condition="$row.is_income == 1"} selected {else /} {/if}>收入</option>
                                                        <option value="2" {if condition="$row.is_income == 2"} selected {else /} {/if}>支出</option>
                                                    </select>
                                                </div>
                                            </div>
                                            {if condition="$row.is_income == 2"}
                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3 supplier" style="display:;">
                                                <label class="control-label col-xs-4">{:__('供应商')}:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <input id="c-supplier"  data-source="supplier/supplier/index" data-field="nickname" class="form-control selectpage" name="supplier_id" type="text" value="{$row.obj_id}" disabled>
                                                </div>
                                            </div>
                                            {else /}

                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3 customer">
                                                <label class="control-label col-xs-4">{:__('客户')}:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <input id="c-customer_id"  data-rule="" data-source="customer/customer/index" data-field="company" class="form-control selectpage customer_id" name="customer_id" type="text" value="{$row.obj_id}" disabled>
                                                </div>
                                            </div>

                                            {/if}




                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                                                <label for="collect_money" class="control-label col-xs-4">结算金额</label>
                                                <div class="col-xs-8">
                                                    <input type="text" class="form-control" name="collect_money" value="{$row.paymoney}"  id="collect_money" data-index="14" onkeyup="checkInputIntFloat(this);" disabled>
                                                </div>
                                            </div>
<!--                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">-->
<!--                                                <label for="address" class="control-label col-xs-4">优惠</label>-->
<!--                                                <div class="col-xs-8">-->
<!--                                                    <input type="text" class="form-control" name="discount" value="" placeholder="" id="discount" data-index="14">-->
<!--                                                </div>-->
<!--                                            </div>-->
                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                                                <label for="c-make_time" class="control-label col-xs-4">制单时间</label>
                                                <div class="col-xs-8">
                                                    <input id="c-make_time" class="form-control datetimepicker" data-date-format="YYYY-MM-DD" data-use-current="true" name="make_time" type="text" value="{$row.make_time|date='Y-m-d',###}" disabled>
                                                </div>
                                            </div>
                                            <br>
                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                                                <label for="c-pay_time" class="control-label col-xs-4">过账时间</label>
                                                <div class="col-xs-8">
                                                    <input id="c-pay_time" class="form-control datetimepicker" data-date-format="YYYY-MM-DD" data-use-current="true" name="pay_time" type="text" value="{$row.pay_time|date='Y-m-d',###}" disabled>
                                                </div>
                                            </div>
                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">
                                                <label  class="control-label col-xs-4">收/付款方式</label>
                                                <div class="col-xs-8">
                                                   <select name="pay_id" id="" class="form-control " disabled>
                                                    {volist name="plist" id="vo"}
                                                        <option value="{$vo.id}"  {if condition="$row.pay_id == $vo.id"} selected  {else /} {/if}>{$vo.name}</option>
                                                    {/volist}
                                                    </select>
                                                </div>
                                            </div>
<!--                                            <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3">-->
<!--                                                <label  class="control-label col-xs-4"></label>-->
<!--                                                <div class="col-xs-8">-->
<!--                                                    <span  class="form-control "></span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <br>-->
                                            <div class="form-group" style="float: left">
                                                <label for="c-thumb" class="control-label col-xs-12 col-sm-2">凭证:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <div class="input-group">
                                                        <input id="c-thumb" class="form-control" size="50" name="thumb" type="text" value="{$row['image']}" />
                                                        <div class="input-group-addon no-border no-padding">
                                                            <span>
                                                                <button type="button" id="plupload-imagethumb" class="btn btn-danger plupload" data-input-id="c-thumb" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/webp" data-multiple="true" data-preview-id="p-thumb">
                                                                <i class="fa fa-upload"></i>上传</button>
                                                            </span>
                                                        </div>
                                                        <span class="msg-box n-right"></span>
                                                    </div>
                                                    <ul class="row list-inline plupload-preview" id="p-thumb"></ul>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label class="control-label col-xs-12 col-sm-2">{:__('备注')}:</label>
                                                <div class="col-xs-12 col-sm-8">
                                                    <textarea id="c-explain" class="form-control " rows="5" name="remark" cols="50" disabled>{$row.remark}</textarea>
                                                </div>
                                            </div>

                                            </div>
                                        </div>
                                    </fieldset>
                                </div>
                            </div>


<!--                            <div class="fixed-table-toolbar"><div class="bs-bars pull-left"><div id="toolbar" class="toolbar" style="position: relative;">-->
<!--                                <a href="javascript:;" class="btn btn-success btn-add " title="添加"><i class="fa fa-plus"></i> 添加</a>-->
<!--                            </div>-->
                            </div>
                            <div class="columns-right pull-right" style="margin-top:10px;margin-bottom:10px;">
                            </div>
                                <table id="table" class="table table-striped table-bordered table-hover table-nowrap"  data-operate-edit="1" data-operate-del="1" width="100%" >
                                    <thead>
                                    <tr style="">
                                        <th style="text-align: center; vertical-align: middle; " data-field="id" style=""><div class="th-inner ">Id</div></th>
                                        <th style="text-align: center; vertical-align: middle; " ><div class="th-inner ">数据来源</div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="operator"><div class="th-inner ">所属仓库</div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="company"><div class="th-inner ">经手人</div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="number"><div class="th-inner ">部门单位</div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="supplier_id"><div class="th-inner ">单据编号</div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="order_goods_total"><div class="th-inner ">创建时间</div><div class="fht-cell"></div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="order_price"><div class="th-inner ">费用</div><div class="fht-cell"></div></th>
                                        <th style="text-align: center; vertical-align: middle; " data-field="explain"><div class="th-inner ">本次结算金额</div><div class="fht-cell"></div></th>
<!--                                        <th style="text-align: center; vertical-align: middle; " data-field="operate"><div class="th-inner ">操作</div><div class="fht-cell"></div></th>-->
                                    </tr>
                                    </thead>
                                    <tbody data-listidx="0" class="connnn" >
                                    {volist name="list" id="vo"}
                                        <tr data-index="0" style="">
                                         <td style="text-align: center; vertical-align: middle; " >
                                             <input name="" value="" style="display: none" class="gid gids">{$vo.id}
                                         </td>
                                        <td style="text-align: center; vertical-align: middle; " >{$vo.source}</td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.house_name}</td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.operator}</td>
                                        <td style="text-align: center; vertical-align: middle; " class="title">{$vo.company}</td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.number}</td>
                                        <td style="text-align: center; vertical-align: middle; ">{$vo.createtime|date='Y-m-d',###}</td>
                                        <td style="text-align: center; vertical-align: middle; " class="tcost">{$vo.cost}</td>
                                        <td style="text-align: center; vertical-align: middle; " class="">{$vo.price}</td>
<!--                                        <td style="text-align: center; vertical-align: middle; ">-->
<!--                                            <a href="javascript:;" class="btn btn-xs btn-danger btn-delone" data-toggle="tooltip" title="" data-table-id="table" data-field-index="15" data-row-index="0" data-button-index="2" data-original-title="删除"><i class="fa fa-trash"></i></a>-->
<!--                                            </td>-->
<!--                                        </tr>-->
                                    {/volist}
                                    </tbody>
                                    <tbody class="tbfoot" data-listidx="0" style="display: ">
                                    <td style="text-align: center; vertical-align: middle; ">合计</td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; " ></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "class="allcost">{$allcost}</td>
                                    <td style="text-align: center; vertical-align: middle; "class="allpaymoney">{$allpaymoney}</td>
                                    </tbody>
                                    <tbody class="tbfoot" data-listidx="0" style="display: ">
                                    <td style="text-align: center; vertical-align: middle; ">优惠</td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; " ></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "></td>
                                    <td style="text-align: center; vertical-align: middle; "class="allcost"></td>
                                    <td style="text-align: center; vertical-align: middle; "class="allpaymoney">{$row.discount}</td>
                                    </tbody>

<!--                                    <tbody class="tbfoot" data-listidx="0" style="display: ">-->
<!--                                    <td style="text-align: center; vertical-align: middle; ">剩余</td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; "></td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; "></td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; "></td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; " ></td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; "></td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; "></td>-->
<!--                                    <td style="text-align: center; vertical-align: middle; "class="allcost"></td>{$allcost}/{$allpaymoney}/{$otherprice}/{$row.discount}-->
<!--                                    <td style="text-align: center; vertical-align: middle; "class="allpaymoney">{$syprice}</td>-->
<!--                                    </tbody>-->
                                </table>
                            </div>
                            <br>
                            <div class="widget-body no-padding">

                                <div class="bootstrap-table">
                                    <div class="commonsearch-table ">
                                        <fieldset>
                                            <div class="row">
                                                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3" style="display:none ">
                                                    <label for="discount" class="control-label col-xs-4">优惠</label>
                                                    <div class="col-xs-8">
                                                        <input type="text" class="form-control " name="discount" value="0" placeholder="优惠" id="discount" data-index="7" onkeyup="checkInputIntFloat(this);">
                                                    </div>
                                                </div>
<!--                                                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3" style="display: ">-->
<!--                                                    <label for="c-storehouse_id" class="control-label col-xs-4">优惠说明</label>-->
<!--                                                    <div class="col-xs-8">-->
<!--                                                        <input id="c-discount-explain"   class="form-control " name="discount_explain" type="text" value="" >-->
<!--                                                    </div>-->
<!--                                                </div>-->
                                                <div class="form-group col-xs-12 col-sm-6 col-md-4 col-lg-3" style="display:none ">
                                                    <label for="c-storehouse_id" class="control-label col-xs-4">总费用</label>
                                                    <div class="col-xs-8">
                                                        <input id="c-actual-cost" data-rule="required"  class="form-control actual_cost" name="actual-cost" type="text" value="0" disabled>
                                                        <input  data-rule="required"  class="form-control actual_cost" name="actual_cost" type="text" value="0" style="display: none">
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                </div>
            </div>
        </div>

    </div>
</form>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>

        {if condition="$row.status == 1"}
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-danger  cancelbill {:$auth->check('coll/collection/cancelbill')?'':'hide'}" >{:__('单据红冲')}</button>
        </div>
        {else /}

        {/if}

    </div>


<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>





<script>
    var arr = []

    function getanalysis(arr) {
         console.log(arr)
        var ids = []
        for (var i =0;i<arr.length;i++){
            ids.push(arr[i].id)
        }
        pay_type = $('#pay_type').val()
        if(pay_type == 1){
            source_id = $('#c-customer_id').val()
        }else{
            source_id = $('#c-supplier').val()
        }
        var url = "{$turl}"
        $.post(url+'/coll/analysis/getanalysis',{pay_type:pay_type,source_id:source_id,ids:JSON.stringify(ids)},function (res) {
            if(res.code == 9){
                layer.msg(res.msg)
                return  false;
            }
            if(res != null){
                for (var ii = 0;ii<res.length;ii++){
                    f(res[ii])
                }
            }else{
                layer.msg('数据异常')
                return false;
            }

        })
    }
</script>
<script>
    function f(res) {
        console.log('数据为'+res)
        $('.tbfoot').attr('style','display:')
        var str = '';
        str += '<tr data-index="0">\n' +
            ' <td style="text-align: center; vertical-align: middle; ">' +
            '<input name="row['+res.id+']['+'id'+']" value="'+res.id+'" style="display: none" class="gid gids'+res.id+'">' +
            ''+res.id+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; ">'+res.source+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; ">'+res.house_name+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; ">'+res.operator+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; " class="title">'+res.company+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; ">'+res.number+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; ">'+res.createtime+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; " class="tcost">'+res.cost+'</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; " class="xxgg">' +
            '<input type="text" class="form-control paymoney" style="display: none" data-max="'+res.paymoney+'" value="'+res.paymoney+'" name="row['+res.id+']['+'paymoney'+']" onkeyup="checkInputIntFloat(this);">' +
            '<span class="price ">'+res.paymoney+'</span></td>\n' +
            '</td>\n' +
            ' <td style="text-align: center; vertical-align: middle; ">\n' +
            ' <a href="javascript:;" class="btn btn-xs btn-danger btn-delone" data-toggle="tooltip" title="" data-table-id="table" data-field-index="15" data-row-index="0" data-button-index="2" data-original-title="删除"><i class="fa fa-trash"></i></a>&nbsp&nbsp' +
            '</td>\n' +
            '</tr>'
        $('.connnn').append(str);
        count()
    }

    var is_check = 0;
    $('tbody').on('click','.xxgg',function () {
        input_index = $('.xxgg').index(this)
        $(this).find('span').attr('style','display:none')
        width = $(this).width()*0.73
        if(width <50){
            width =50;
        }
        $(this).find('input').show()
        $(this).find('input').focus();
        $(this).find('input').select();
        $(this).find('input').attr('style','width:'+width+'px')
    })
    $('.connnn').on('blur','input',function () {
        var tval = $(this).val();
        if($(this).data('max') >=0){
            if(tval > $(this).data('max')){
                layer.msg('不能超过上限值,已自动修正')
                $(this).val($(this).data('max'))
            }
        }
        if($(this).val() == ''){
            layer.msg('不能为空')
            return false
        }
        $(this).hide();
        $(this).next().attr('style','display:')
        $(this).next().html($(this).val())
        count()
    })
    function count(){
        var paymoney = 0;
        var allcost = 0;
        var actual_cost = 0;
        $('.connnn').find("tr").each(function(){
            paymoney+=$(this).find('.paymoney').val()*1
            allcost+=$(this).find('.tcost').html()*1
        })
        $('.allcost').html(allcost)
        $('.allpaymoney').html(paymoney)
        actual_cost = paymoney-$('#discount').val()
        $('.actual_cost').val(actual_cost)
        $('.actual_cost').html(actual_cost)
    }
    function checkInputIntFloat(oInput) {
        // oInput.value = oInput.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
        // oInput.value = oInput.value.replace(/^\./g,""); //验证第一个字符是数字
        // oInput.value = oInput.value.replace(/\.{2,}/g,"."); //只保留第一个, 清除多余的
        // oInput.value = oInput.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
        // oInput.value = oInput.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //只能输入两个小数
        // if('' != oInput.value.replace(/\d{1,}\.{0,1}\d{0,}/,'')) {
        //     oInput.value = oInput.value.match(/\d{1,}\.{0,1}\d{0,}/) == null ? '' :oInput.value.match(/\d{1,}\.{0,1}\d{0,}/);
        // }
    }
    $('body').on('blur','#discount',function () {
        count()
    })
    $('.subpurchase').click(function () {
        var collect_money = $('#collect_money').val()
        if($('.actual_cost').val() != collect_money){
            layer.msg('结算金额和实际收入不符合')
            return false
        }
        // $('.draft').val(0)
        // if(is_check == 0){
        //     var noticename = '';
        //     if($('.actual_cost').val() <0){
        //         layer.msg('实际费用不能低于0')
        //         //     $('#discount').val(0)
        //         //     count()
        //         return false
        //     }
        //     // console.log($('#discount').val())
        //     // console.log($('.actual_cost').val())
        //     // if($('#discount').val() >$('.actual_cost').val()){
        //     //     layer.msg('优惠费用不能超过商品总额')
        //     //     $('#discount').val(0)
        //     //     count()
        //     //     return false
        //     // }
        //     // return false
        //     if($('.connnn').find("tr").length<1){
        //         layer.msg('没有选择商品')
        //         return  false;
        //     }
        //     $('.connnn').find("tr").each(function(){
        //         var anum = $(this).find('.requisition_num').val()
        //         // console.log(anum)
        //         if(anum < 1 ){
        //             noticename += $(this).find('.title').html() +'&nbsp'
        //         }
        //
        //     });
        //     console.log('问题商品:'+noticename)
        //     if(noticename != ''){
        //         layer.msg(noticename+'未设置数量？')
        //         // layer.confirm(noticename+'未设置金额 数量？', {
        //         //     btn: ['跳过','设置'] //按钮
        //         // }, function(){
        //         //     is_check = 1;
        //         //     $('.subpurchase').click()
        //         // }, function(){
        //         //
        //         // });
        //         return false;
        //     }else{
        //
        //     }
        // }
    })
    // $('.subpurchases').click(function () {
    //     $('.draft').val(1)
    //     if(is_check == 0){
    //         var noticename = '';
    //         if($('.actual_cost').val() <0){
    //             layer.msg('实际费用不能低于0')
    //             return false
    //         }
    //         if($('.connnn').find("tr").length<1){
    //             layer.msg('没有选择商品')
    //             return  false;
    //         }
    //         $('.connnn').find("tr").each(function(){
    //             var anum = $(this).find('.requisition_num').val()
    //             if(anum < 1 ){
    //                 noticename += $(this).find('.title').html() +'&nbsp'
    //             }
    //         });
    //         if(noticename != ''){
    //             layer.msg(noticename+'未设置数量？')
    //             return false;
    //         }else{
    //
    //         }
    //     }
    // })

</script>
